{% extends "base.html" %}

{% block title %}{{ user1 }} + {{ user2 }}{% endblock %}

{% block content %}
<div id="card">
  <div id="title">{{relation}}</div>
  <div id="contents">
    {% for story in stories %}
    <div id="story{{story.id}}">
      <span class="people">{{ user1 }} + {{ user2 }}</span>
      <span class="when">{{ story.when }}</span>
      <span class="where">{{ story.where }}</span>
      <span class="why">{{ story.why }}</span>
    </div>
  {% endfor %}
  </div>
  <div id="input_area">
    <form action="/story/{{ user1 }}+{{ user2 }}/save/" method="post" name="story">
      <div id="when">
	<span class="label">When?</span>
	<span class="value"><input type="text" name="when" /></span>
      </div>
      <div id="where">
	<span class="label">Where?</span>
	<span class="value"><input type="text" name="where" /></span>
      </div>
      <div id="why">
	<span class="label">Why?</span>
	<span class="value"><textarea rows="4" name="why"></textarea></span>
      </div>
      <input type="hidden" name="user1" value="{{user1}}" />
      <input type="hidden" name="user2" value="{{user2}}" />
      <div id="submit">
	<span class="label">&nbsp;</span>
	<span class="value"><input type="submit" value="Save story" /></span>
      </div>
    </form>
  </div>
</div>
{% endblock %}
